// 拿到登录状态
import React,{useEffect} from 'react'

import { useContext } from "react";
import {AuthContext} from '../App.jsx'

const Header = () =>{

    const {state,dispatch} = useContext(AuthContext)
    // console.log(state);
    // 试着修改用户的登录状态？
    useEffect(() => {
       setTimeout(()=>{
        dispatch({
            type:'LOGIN',
            payload:{
                isAuthenticated:true,
                user:{name:'keli'}
        }})
       },2000)
    }, [])
    return (
        <nav id="navigation">
            <h1 className="logo" href="#">
                HOOK
            </h1>
            {/* 登出按钮（退出登录） */}
            <button onClick={()=> dispatch({
                type:'LOGOUT'
            })}>
                <h1>Log out</h1>
            </button>
        </nav>
    )
}

export default Header